// Licensed to the Apache Software Foundation (ASF) under one
// or more contributor license agreements.  See the NOTICE file
// distributed with this work for additional information
// regarding copyright ownership.  The ASF licenses this file
// to you under the Apache License, Version 2.0 (the
// "License"); you may not use this file except in compliance
// with the License.  You may obtain a copy of the License at
//
//   http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing,
// software distributed under the License is distributed on an
// "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
// KIND, either express or implied.  See the License for the
// specific language governing permissions and limitations
// under the License.

import { Steps } from 'antd';
import { useEffect, useState } from 'react';
import { Navigate, Route, Routes, useLocation, useMatch } from 'react-router';
import { LocalStepsEnum } from '../../initialize.data';
import { AdminUser } from '../components/admin-user/admin-user';
import { AuthFinish } from '../components/finish/finish';

const { Step } = Steps;

export function AuthLocal() {
    const match = useMatch('/initialize/auth/:authType/:step');
    const [step, setStep] = useState(LocalStepsEnum['admin-user']);

    const location = useLocation();

    useEffect(() => {
        const step = match?.params.step as string;
        setStep(LocalStepsEnum[step]);
    }, [location.pathname]);

    return (
        <>
            <Steps current={step}>
                <Step title="本地认证" />
                <Step title="完成" />
            </Steps>
            <div style={{ marginTop: 80 }}>
                <Routes>
                    <Route path="admin-user" element={<AdminUser />} />
                    <Route path="finish" element={<AuthFinish />} />
                    <Route path="/" element={<Navigate replace to="admin-user" />} />
                </Routes>
            </div>
        </>
    );
}
